<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://java.sun.com/jsf/core">

    <ui:composition template="layout.xhtml">
        <ui:define name="body">

            <h2 class="title">Pesquisar Cadastro Individual</h2>
            <p:growl id="messages" showDetail="true" autoUpdate="true"  /> 

            <hr/>
            <h:form id="pesquisarForm" enctype="multipart/form-data">
                <p:panel id="profissionalPanel" styleClass="container_24 clearfix withoutBorder">
                    <fieldset>
                        <legend>Profissional</legend>

                        <p:outputLabel value="Nº do cartão SUS do profissional:" styleClass="grid_8" for="susProfissional"/>
                        <p:inputText id="susProfissional" styleClass="grid_6" 
                                     readonly="#{managerPesquisarCadastroIndividual.cadastro.profissional.id ne null}"
                                     value="#{managerPesquisarCadastroIndividual.cadastro.profissional.numeroCartaoSus}"/>
                        <div>
                            <p:commandButton id="pesquisarProfissional" icon="ui-icon-search"
                                             process="@this"
                                             rendered="#{managerPesquisarCadastroIndividual.cadastro.profissional.id eq null}"
                                             onclick="dialogProfissional.show()"/>
                            <p:commandButton id="removerProfissional" icon="ui-icon-trash"
                                             update=":pesquisarForm:profissionalPanel" process="@this"
                                             rendered="#{managerPesquisarCadastroIndividual.cadastro.profissional.id ne null}"
                                             actionListener="#{managerPesquisarCadastroIndividual.removerProfissional()}"/>
                        </div>
                        <div class="clear-both"/>

                        <p:outputLabel value="Nome:" styleClass="grid_8" for="nomeProfissional" />
                        <p:inputText id="nomeProfissional" styleClass="grid_15"
                                     readonly="#{managerPesquisarCadastroIndividual.cadastro.profissional.id ne null}"
                                     value="#{managerPesquisarCadastroIndividual.cadastro.profissional.nome}" />
                        <div class="clear-both"/>

                        <p:outputLabel value="Cod. CNES unidade:" styleClass="grid_8" for="cnes" />
                        <p:inputText id="cnes" styleClass="grid_6" 
                                     readonly="#{managerPesquisarCadastroIndividual.cadastro.profissional.id ne null}"
                                     value="#{managerPesquisarCadastroIndividual.cadastro.profissional.equipe.unidade.codigoCNES}" />

                        <p:outputLabel value="Microárea:" styleClass="grid_4 alpha" for="microarea" />
                        <p:inputText id="microarea" styleClass="grid_5" 
                                     readonly="#{managerPesquisarCadastroIndividual.cadastro.profissional.id ne null}"
                                     value="#{managerPesquisarCadastroIndividual.cadastro.profissional.microArea.codigo}" />
                        <div class="clear-both"/>

                        <p:outputLabel value="Cod. equipe (INE):" styleClass="grid_8" for="equipeIne" />
                        <p:inputText id="equipeIne" styleClass="grid_6" 
                                     readonly="#{managerPesquisarCadastroIndividual.cadastro.profissional.id ne null}"
                                     value="#{managerPesquisarCadastroIndividual.cadastro.profissional.equipe.codigo}" />

                        <p:outputLabel value="Data:" styleClass="grid_4 alpha" for="dataCadastro" />
                        <p:calendar id="dataCadastro" styleClass="grid_5"
                                    showOn="both" locale="pt" yearRange="1900:2020" 
                                    navigator="true" pattern="dd/MM/yyyy"
                                    value="#{managerPesquisarCadastroIndividual.cadastro.dataCadastro}" />
                    </fieldset>
                </p:panel>

                <p:panel id="responsavelPanel" styleClass="container_24 clearfix withoutBorder">
                    <fieldset>
                        <legend>Responsável</legend>

                        <p:outputLabel value="Cartão SUS:" styleClass="grid_3" for="cartaoSusResponsavel"/>
                        <p:inputText id="cartaoSusResponsavel" styleClass="grid_5"
                                     value="#{managerPesquisarCadastroIndividual.cadastro.cartaoResponsavelFamiliar.numeroCartaoSus}"/>
                        <div>
                            <p:commandButton id="pesquisarResponsavel" icon="ui-icon-search"
                                             process="@this"
                                             rendered="#{managerPesquisarCadastroIndividual.cadastro.cartaoResponsavelFamiliar.id eq null}"
                                             onclick="dialogResponsavel.show()"/>
                            <p:commandButton id="removerResponsavel" icon="ui-icon-trash"
                                             update=":pesquisarForm:responsavelPanel" process="@this"
                                             rendered="#{managerPesquisarCadastroIndividual.cadastro.cartaoResponsavelFamiliar.id ne null}"
                                             actionListener="#{managerPesquisarCadastroIndividual.removerResponsavel()}"/>
                        </div>
                        <div class="clear"/>

                        <p:outputLabel value="Nome:" styleClass="grid_3" for="nomeResponsavelInputText"/>
                        <p:inputText id="nomeResponsavelInputText" styleClass="grid_19" 
                                     value="#{managerPesquisarCadastroIndividual.cadastro.cartaoResponsavelFamiliar.nome}"/>
                    </fieldset>
                </p:panel>

                <p:panel id="cidadaoPanel" styleClass="container_24 clearfix withoutBorder">
                    <fieldset>
                        <legend>Cidadão</legend>

                        <p:outputLabel value="Cartão SUS:" styleClass="grid_3" for="cartaoSusCidadao"/>
                        <p:inputText id="cartaoSusCidadao" styleClass="grid_5"
                                     value="#{managerPesquisarCadastroIndividual.cadastro.cidadao.numeroCartaoSus}"/>
                        <div>
                            <p:commandButton id="pesquisarCidadao" icon="ui-icon-search"
                                             process="@this"
                                             rendered="#{managerPesquisarCadastroIndividual.cadastro.cidadao.id eq null}"
                                             onclick="dialogCidadao.show()"/>
                            <p:commandButton id="removerCidadao" icon="ui-icon-trash"
                                             update=":pesquisarForm:cidadaoPanel" process="@this"
                                             rendered="#{managerPesquisarCadastroIndividual.cadastro.cidadao.id ne null}"
                                             actionListener="#{managerPesquisarCadastroIndividual.removerCidadao()}"/>
                        </div>
                        <div class="clear"/>

                        <p:outputLabel value="Nome:" styleClass="grid_3" for="nomeInputText"/>
                        <p:inputText id="nomeInputText" styleClass="grid_19" 
                                     value="#{managerPesquisarCadastroIndividual.cadastro.cidadao.nome}"/>
                    </fieldset>
                </p:panel>

                <br/>
                <div class="buttonAction">
                    <p:commandButton id="pesquisarCommandButton" value="Pesquisar" icon="ui-icon-search"
                                     update="cadastroDataTable"
                                     actionListener="#{managerPesquisarCadastroIndividual.pesquisar()}"
                                     styleClass="ui-priority-primary" />
                    <p:commandButton id="bt_clear" value="Limpar" icon="ui-icon-clean"
                                     actionListener="#{managerPesquisarCadastroIndividual.limpar()}"
                                     update="@form" process="@this" />
                </div>
                <br/><br/>

                <p:blockUI id="BLOCK" block="resultPanel" trigger="pesquisarCommandButton, cadastroDataTable" > 
                    <p:graphicImage value="media/images/ajax-loader.gif"/>
                </p:blockUI> 

                <h4 class="title">Resultado</h4>
                <p:panel id="resultPanel" styleClass="container_24 clearfix withoutBorder">

                    <p:dataTable id="cadastroDataTable" var="cadastro" value="#{managerPesquisarCadastroIndividual.dataModel}"
                                 styleClass="grid_24" rowIndexVar="rowid" 
                                 style="white-space: pre-wrap;" 
                                 binding="#{managerPesquisarCadastroIndividual.searchResults}"
                                 rows="5" paginator="true" lazy="true"
                                 paginatorTemplate="{FirstPageLink} {PreviousPageLink} {CurrentPageReport} {NextPageLink} {LastPageLink}"
                                 currentPageReportTemplate="{currentPage} de {totalPages}"
                                 paginatorPosition="bottom" emptyMessage="Nenhum registro">

                        <f:facet name="header">
                            <p:outputLabel value="Cadastros #{managerPesquisarCadastroIndividual.searchResults.rowCount eq 0 ? '' : '('.concat(managerPesquisarCadastroIndividual.searchResults.rowCount).concat(')')}" />
                        </f:facet>

                        <p:column headerText="Ação" width="120">
                            <p:button title="Editar" icon="ui-icon-pencil"
                                      href="editarcadastroindividual.xhtml?cadastroEditarId=#{cadastro.id}"/>

                            <p:button title="Visualizar" icon="ui-icon-zoomin"
                                      href="visualizarcadastroindividual.xhtml?cadastroVisualizarId=#{cadastro.id}"/>

                            <p:commandButton update="@form" title="Excluir"
                                             oncomplete="dlg.show()"
                                             icon="ui-icon-trash">
                                <f:setPropertyActionListener target="#{managerPesquisarCadastroIndividual.entidadeRemover}" value="#{cadastro}" />
                            </p:commandButton>
                        </p:column>

                        <p:column headerText="Profissional" width="250">
                            <h:outputText value="#{cadastro.profissional.nome} - #{cadastro.profissional.numeroCartaoSus}" />
                        </p:column>
                        <p:column headerText="Cidadão">
                            <h:outputText value="#{cadastro.cidadao.nome} - #{cadastro.cidadao.numeroCartaoSus}"/>
                        </p:column> 
                    </p:dataTable> 

                </p:panel>

                <p:dialog id="modalDialog" header="Confirmação de remoção" widgetVar="dlg" modal="true" 
                          height="80" closable="true" resizable="false" >
                    <h:outputText value="Tem certeza que deseja remover este cadastro ?" />

                    <div class="buttonAction">
                        <p:commandButton value="Sim" actionListener="#{managerPesquisarCadastroIndividual.remover()}"
                                         update="@form" icon="ui-icon-check"/>
                        <p:commandButton value="Não" icon="ui-icon-close"
                                         oncomplete="dlg.hide()" />
                    </div>
                </p:dialog>
            </h:form>

            <p:dialog id="profissionalDialog" widgetVar="dialogProfissional" header="Profissional" dynamic="true"
                      modal="true" appendToBody="false" resizable="false" width="1024px" height="450px" draggable="true" closable="false">
                <h:form id="dialogForm">

                    <p:panel id="profissionalPesquisarPanel" styleClass="container_24 clearfix both withoutBorder">
                        <h4 class="title">Pesquisar Profissional</h4>

                        <p:outputLabel value="Nome:" styleClass="grid_3" for="nomeInputText" />
                        <p:inputText id="nomeInputText" styleClass="grid_19" 
                                     value="#{ managerPesquisarCadastroIndividual.profissional.nome }" />
                        <div class="clear"/>

                        <p:outputLabel value="CNES:" styleClass="grid_3" for="cnesInputText" />
                        <p:inputText id="cnesInputText" styleClass="grid_8" 
                                     value="#{ managerPesquisarCadastroIndividual.profissional.codigoCNES }" />

                        <p:outputLabel value="Cartão SUS:" styleClass="grid_3 alpha" for="susInputText" />
                        <p:inputText id="susInputText" styleClass="grid_8"  
                                     value="#{ managerPesquisarCadastroIndividual.profissional.numeroCartaoSus }" />
                        <div class="clear"/>

                        <div class="buttonAction">
                            <p:commandButton actionListener="#{ managerPesquisarCadastroIndividual.pesquisarProfissional() }" value="Pesquisar"
                                             update=":dialogForm:profissionalPesquisarPanel" 
                                             process=":dialogForm:profissionalPesquisarPanel"
                                             icon="ui-icon-search" />
                            <p:commandButton value="Cancelar" icon="ui-icon-cancel" oncomplete="dialogProfissional.hide()"
                                             actionListener="#{managerPesquisarCadastroIndividual.limparProfissionalDialog()}"
                                             process="@this" update="@form" />
                        </div>
                        <br/>

                        <p:dataTable id="profissionaisDataTable" var="profissional" 
                                     value="#{ managerPesquisarCadastroIndividual.profissionais }" 
                                     rows="5" paginator="true" paginatorPosition="bottom" rowKey="#{ profissional.id }"
                                     selectionMode="single" emptyMessage="Nenhum profissional encontrado"
                                     style="white-space: pre-wrap;" styleClass="grid_24">

                            <f:facet name="header">Profissional</f:facet>
                            <p:ajax event="rowSelect" process=":dialogForm:profissionaisDataTable" update="@this"/>

                            <p:column headerText="Ação" width="40">
                                <p:commandButton update=":pesquisarForm:profissionalPanel" process="@this"
                                                 actionListener="#{managerPesquisarCadastroIndividual.selecionarProfissional(profissional)}"
                                                 alt="Selecionar" icon="ui-icon-check" oncomplete="dialogProfissional.hide();" />
                            </p:column>

                            <p:column headerText="Número Cartão SUS" width="250">
                                <h:outputText value="#{ profissional.numeroCartaoSus }" />
                            </p:column>

                            <p:column headerText="Nome">
                                <h:outputText value="#{ profissional.nome }" />
                            </p:column>

                        </p:dataTable>

                    </p:panel>

                </h:form>

            </p:dialog>

            <p:dialog id="responsavelDialog" widgetVar="dialogResponsavel" header="Responsável" dynamic="true"
                      modal="true" appendToBody="false" resizable="false" width="1024px" height="450px" draggable="true" closable="false">
                <h:form id="responsavelForm">

                    <p:panel id="responsavelPesquisarPanel" styleClass="container_24 clearfix both withoutBorder">
                        <h4 class="title">Pesquisar Responsável</h4>

                        <p:outputLabel value="Nome:" styleClass="grid_3" for="nomeInputText" />
                        <p:inputText id="nomeInputText" styleClass="grid_19" 
                                     value="#{ managerPesquisarCadastroIndividual.responsavel.nome }" />
                        <div class="clear"/>

                        <p:outputLabel value="CPF:" styleClass="grid_3" for="cnesInputText" />
                        <p:inputMask id="cnesInputText" styleClass="grid_8" mask="999.999.999-99"
                                     value="#{ managerPesquisarCadastroIndividual.responsavel.cpf }" />

                        <p:outputLabel value="Cartão SUS:" styleClass="grid_3 alpha" for="susInputText" />
                        <p:inputText id="susInputText" styleClass="grid_8"
                                     value="#{ managerPesquisarCadastroIndividual.responsavel.numeroCartaoSus }" />
                        <div class="clear"/>

                        <div class="buttonAction">
                            <p:commandButton actionListener="#{ managerPesquisarCadastroIndividual.pesquisarResponsavel() }" value="Pesquisar"
                                             update=":responsavelForm:responsavelPesquisarPanel" 
                                             process=":responsavelForm:responsavelPesquisarPanel"
                                             icon="ui-icon-search" />
                            <p:commandButton value="Cancelar" icon="ui-icon-cancel" oncomplete="dialogResponsavel.hide()"
                                             actionListener="#{managerPesquisarCadastroIndividual.limparResponsavelDialog()}"
                                             process="@this" update="@form" />
                        </div>
                        <br/>

                        <p:dataTable id="responsaveisDataTable" var="responsavel" 
                                     value="#{ managerPesquisarCadastroIndividual.responsaveis }" 
                                     rows="5" paginator="true" paginatorPosition="bottom" rowKey="#{ responsavel.id }"
                                     selectionMode="single" emptyMessage="Nenhum registro encontrado"
                                     style="white-space: pre-wrap;" styleClass="grid_24">

                            <f:facet name="header">Responsável</f:facet>
                            <p:ajax event="rowSelect" process=":responsavelForm:responsaveisDataTable" update="@this"/>

                            <p:column headerText="Ação" width="40">
                                <p:commandButton update=":pesquisarForm:responsavelPanel" process="@this"
                                                 actionListener="#{managerPesquisarCadastroIndividual.selecionarResponsavel(responsavel)}"
                                                 alt="Selecionar" icon="ui-icon-check" oncomplete="dialogResponsavel.hide();" />
                            </p:column>

                            <p:column headerText="Número Cartão SUS" width="250">
                                <h:outputText value="#{ responsavel.numeroCartaoSus }" />
                            </p:column>

                            <p:column headerText="Nome">
                                <h:outputText value="#{ responsavel.nome }" />
                            </p:column>

                            <p:column headerText="CPF">
                                <h:outputText value="#{ responsavel.cpf }" />
                            </p:column>

                        </p:dataTable>

                    </p:panel>

                </h:form>

            </p:dialog>

            <p:dialog id="cidadaoDialog" widgetVar="dialogCidadao" header="Cidadão" dynamic="true"
                      modal="true" appendToBody="false" resizable="false" width="1024px" height="450px" draggable="true" closable="false">
                <h:form id="cidadaoForm">

                    <p:panel id="cidadaoPesquisarPanel" styleClass="container_24 clearfix both withoutBorder">
                        <h4 class="title">Pesquisar Cidadão</h4>

                        <p:outputLabel value="Nome:" styleClass="grid_3" for="nomeInputText" />
                        <p:inputText id="nomeInputText" styleClass="grid_19" 
                                     value="#{ managerPesquisarCadastroIndividual.cidadao.nome }" />
                        <div class="clear"/>

                        <p:outputLabel value="CPF:" styleClass="grid_3" for="cnesInputText" />
                        <p:inputMask id="cnesInputText" styleClass="grid_8" mask="999.999.999-99"
                                     value="#{ managerPesquisarCadastroIndividual.cidadao.cpf }" />

                        <p:outputLabel value="Cartão SUS:" styleClass="grid_3 alpha" for="susInputText" />
                        <p:inputText id="susInputText" styleClass="grid_8"
                                     value="#{ managerPesquisarCadastroIndividual.cidadao.numeroCartaoSus }" />
                        <div class="clear"/>

                        <div class="buttonAction">
                            <p:commandButton actionListener="#{ managerPesquisarCadastroIndividual.pesquisarCidadao() }" value="Pesquisar"
                                             update=":cidadaoForm:cidadaoPesquisarPanel" 
                                             process=":cidadaoForm:cidadaoPesquisarPanel"
                                             icon="ui-icon-search" />
                            <p:commandButton value="Cancelar" icon="ui-icon-cancel" oncomplete="dialogCidadao.hide()" 
                                             actionListener="#{managerPesquisarCadastroIndividual.limparCidadaoDialog()}"
                                             process="@this" update="@form" />
                        </div>
                        <br/>

                        <p:dataTable id="cidadaosDataTable" var="cidadao" 
                                     value="#{ managerPesquisarCadastroIndividual.cidadaos }" 
                                     rows="5" paginator="true" paginatorPosition="bottom" rowKey="#{ cidadao.id }"
                                     selectionMode="single" emptyMessage="Nenhum registro encontrado"
                                     style="white-space: pre-wrap;" styleClass="grid_24">

                            <f:facet name="header">Cidadãos</f:facet>
                            <p:ajax event="rowSelect" process=":cidadaoForm:cidadaosDataTable" update="@this"/>

                            <p:column headerText="Ação" width="40">
                                <p:commandButton update=":pesquisarForm:cidadaoPanel" process="@this"
                                                 actionListener="#{managerPesquisarCadastroIndividual.selecionarCidadao(cidadao)}"
                                                 alt="Selecionar" icon="ui-icon-check" oncomplete="dialogCidadao.hide();" />
                            </p:column>

                            <p:column headerText="Número Cartão SUS" width="250">
                                <h:outputText value="#{ cidadao.numeroCartaoSus }" />
                            </p:column>

                            <p:column headerText="Nome">
                                <h:outputText value="#{ cidadao.nome }" />
                            </p:column>

                            <p:column headerText="CPF">
                                <h:outputText value="#{ cidadao.cpf }" />
                            </p:column>

                        </p:dataTable>

                    </p:panel>

                </h:form>

            </p:dialog>

        </ui:define>
    </ui:composition>
</html>
